$.ajax({
    type:'get',
    url:'/static/js/mayinterest.json',
    dataType:'json',
    success:function(data){
        $('#username').text(data.username);
        $('#profile').prop('src', data.profile);
    }
});
let id = (new URL(location.href)).searchParams.get('id');
$.ajax({
    type: 'get',
    url: '/static/js/detail.json?id=' + id,
    dataType:'json',
    success:function(data){
        $('#workname').text('The Detail of ' + data.workname);
        let field = ''; for (const j of data.field) field += '<br>' + j;
        $('#info').after(`
            <div class="card mb-3">
                <div class="card-body">
                    <strong>Description: </strong><p>${data.description}</p>
                </div>
                <ul class="list-group list-group-flush">
                    <li class="list-group-item"><strong>Last update: </strong>${data.time}</li>
                    <li class="list-group-item"><strong>Content: </strong>${data.content}</li>
                    <li class="list-group-item"><strong>Contribute: </strong>${data.num} contributes</li>
                    <li class="list-group-item"><strong>Field: </strong>${field}</li>
                </ul>
            </div>
        `);
        let s = '';
        for (const i of data.record) {
            s += `
                <div class="card mb-3">
                    <div class="card-body">
                        <h5 class="card-title">${i.name}</h5>
                        <h6 class="card-subtitle text-muted">Update time: ${i.time}</h6>
                    </div>
                    <ul class="list-group list-group-flush">
                        <li class="list-group-item"><strong>Description: </strong><p>${i.description}</p></li>
                        <li class="list-group-item"><strong>Update user: </strong>${i.user}</li>
                        <li class="list-group-item"><strong>Update type: </strong>${i.type} contributes</li>
                        <li class="list-group-item"><strong>Resource link: </strong><a href="${i.link}" target="_blank">${i.link}</a></li>
                    </ul>
                </div>
            `;
        }
        $('#record').after(s);
    }
});
$('#add').click(function () {
    let link = $('#link').val();
    if (link == '') { alert('The link is empty'); return; }
    $.ajax({
        type: 'post',
        url: '/add',
        data: {
            id: i.id,
            type: $('#linktype').val(),
            link: link
        },
        dataType: 'text',
        success: function(data) {
            if (data == 'success') location.reload(); else alert(data);
        },
        error: function (http, e) {
            alert(http.status + e);
        }
    });
});
